<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
  <head>
    <title>LogIn</title>

    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css">
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/javascript.js"></script>
    <link rel="stylesheet" type="text/css" href="css/estilo.css">

  </head>
 
  <body>

    <div class="cabecera">
      <h1 align="center">FESTIVAL REGISTRATION SYSTEM</h1>
    </div>

    <div id="login-overlay" class="modal-dialog">
      <div class="modal-content">
          <div class="modal-header">
              <h4 class="modal-title" id="myModalLabel">Login to FERS</h4>
          </div>
          <div class="modal-body">
              <div class="row">
                  <div class="col-xs-6">
                      <div class="well">
                          <form id="loginForm" method="POST" action="LoginServlet">
                              <div class="form-group">
                                  <label for="username" class="control-label">Username</label>
                                  <input type="text" class="form-control" id="username" name="username" value="" required="" pattern=".{6,12}" title="Please enter 6 characters minimun" placeholder="Please enter your username">
                                  <span class="help-block"></span>
                              </div>
                              <div class="form-group">
                                  <label for="password" class="control-label">Password</label>
                                  <input type="password" class="form-control" id="password" name="password" value="" required="" pattern=".{6,15}" title="Please enter 6 characters minimun" placeholder="Please enter your password">
                                  <span class="help-block"></span>
                              </div>
                              <div id="loginErrorMsg" class="alert alert-error hide">Wrong username og password</div>
                              <div class="checkbox">
                                  <label>
                                      <input type="checkbox" name="remember" id="remember"> Remember login
                                  </label>
                                  <p class="help-block">(if this is a private computer)</p>
                              </div>
                              <button type="submit" class="btn btn-success btn-block">Login</button>
                              
                          </form>
                      </div>
                  </div>
                  <div class="col-xs-6">
                      <p class="lead">Register now for <span class="text-success">FREE!</span></p>
                      <ul class="list-unstyled" style="line-height: 2">
                          <li><span class="fa fa-check text-success"></span> Enjoy the best festival</li>
                          <li><span class="fa fa-check text-success"></span> Join the funniest events in Codington</li>
                      </ul>
                      <form action="RegisterServlet" method="GET">
                      	<p><button type="submit" class="btn btn-info btn-block">Yes please, register now!</button></p>
                    
                      </form>
                  </div>
              </div>
          </div>
      </div>
    </div>

    <div class="imgdiv">
      <img class="img">
    </div>

  </body>
</html>